<template>
  <h1>微博添加</h1>
  <hr/>
  
    <el-form
    :label-position="labelPosition"
    label-width="auto"
    :model="formLabelAlign"
    style="max-width: 600px"
  >

    
    <el-form-item label="title" :label-position="itemLabelPosition">
      <el-input v-model="w.title" />
    </el-form-item>
    
    <el-form-item label="pic" :label-position="itemLabelPosition">
       <el-upload
        class="upload-demo"
        action="http://localhost:82/my/ajax/weibo"
        :on-change="handleFileChange"
        :auto-upload="false"
      >
        <el-button type="primary">点击上传</el-button>
      </el-upload> <!-- <input type="file" name="pic"/> -->
    </el-form-item>
 
    <el-form-item label="content" :label-position="itemLabelPosition">
       <el-input
    v-model="w.content"
    style="width: 240px"
    :rows="2"
    type="textarea"
    placeholder="Please input"
    
  />
    </el-form-item>
  </el-form>
   
  <el-button type="success" @click="publish()">添加</el-button>
  

</template>

<script lang='ts' setup>
import axios from '@/axios/index.js'
import { onBeforeMount, onMounted, reactive,ref } from 'vue'

import type { FormItemProps, FormProps } from 'element-plus'
import {  useRouter } from 'vue-router'
import { setMapStoreSuffix } from 'pinia'
 
const labelPosition = ref<FormProps['labelPosition']>('right')
const itemLabelPosition = ref<FormItemProps['labelPosition']>('')

const formLabelAlign = reactive({
  name: '',
  region: '',
  type: '',
})

const w = reactive({
  title:'',
  pic:null as File | null,
  content:''
})

function handleFileChange(file: any, fileList: any[]) {

  w.pic = file.raw
}

const router = useRouter();
       async  function publish (){
          if (!w.pic) {
    console.warn('No file selected.')
    return
  }

           var fd = new FormData()
           fd.append("title",w.title)
           fd.append("content",w.content)
           fd.append("pic",w.pic)
          //  fd.append("pic",this.$refs.xx.files[0])
           console.log(fd.get('pic'));
           
          var p= await axios.post("http://localhost:82/my/ajax/weibo",fd,{
            withCredentials: true,
              headers:{
                'Content-Type':'multipart/form-data'
              }
            })

            // console.log(p);
            router.push('/index')
            
            
        }

// onBeforeMount(()=>{
//   if(sessionStorage.getItem('mc')==null){
//     router.push('/login')
//   }
// })
    

</script>

<style>

</style>